Motion >> Repos - motion-next.git/blob

   1 <md-dialog
   2   class="disposition-dialog"
   3   aria-label="disposition"
   4   ng-init="vm.onInit()"
   5 >
   6   <form name="dispositionForm" class="md-inline-form" novalidate>
   7     <md-toolbar class="md-background-bg">
   8       <div
   9         class="md-toolbar-tools"
  10         layout="row"
  11         layout-align="space-between center"
  12       >
  13         <span
  14           ng-if="!vm.interaction.closed"
  15           class="title"
  16           translate="DASHBOARDS.DISPOSE"
  17         ></span>
  18         <span
  19           ng-if="vm.interaction.closed"
  20           class="title"
  21           translate="DASHBOARDS.INFO"
  22         ></span>
  23         <md-button
  24           class="md-icon-button"
  25           ng-click="vm.closeDialog()"
  26           ng-if="!vm.mandatoryDisposition"
  27         >
  28           <md-icon
  29             md-font-icon="icon-close"
  30             aria-label="Close dialog"
  31           ></md-icon>
  32         </md-button>
  33       </div>
  34     </md-toolbar>
  35     <md-dialog-content ms-scroll>
  36       <div class="error-list">
  37         <div
  38           ng-repeat="error in vm.errors"
  39           class="error"
  40           layout="row"
  41           layout-align="space-between center"
  42         >
  43           <div>
  44             <span class="message">{{error.message}}</span>
  45             <span class="type">({{error.type}})</span>
  46           </div>
  47           <md-button class="md-icon-button">
  48             <md-icon
  49               md-font-icon="icon-alert-box"
  50               aria-label="alert error"
  51               class="s16"
  52             ></md-icon>
  53           </md-button>
  54         </div>
  55       </div>
  56       <md-input-container class="md-block">
  57         <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
  58         <md-select
  59           name="disposition"
  60           ng-model="vm.firstLevelDisposition"
  61           ng-change="vm.onDispositionChange('first')"
  62           required
  63         >
  64           <md-option ng-value="null" ng-if="!vm.mandatoryDisposition"
  65             >NONE</md-option
  66           >
  67           <md-option
  68             ng-value="disposition"
  69             ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
  70           >
  71             {{ disposition.name }}</md-option
  72           >
  73         </md-select>
  74         <div
  75           ng-messages="dispositionForm.disposition.$error"
  76           ng-show="dispositionForm.disposition.$touched"
  77           role="alert"
  78         >
  79           <div ng-message="required">
  80             <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
  81               >Disposition field is required</span
  82             >
  83           </div>
  84         </div>
  85       </md-input-container>
  86       <div
  87         ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
  88         layout="row"
  89         layout-align="start center"
  90       >
  91         <md-input-container class="md-block" flex>
  92           <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
  93             >Second Level Disposition</label
  94           >
  95           <md-select
  96             name="secondLevelDisposition"
  97             ng-model="vm.secondLevelDisposition"
  98             ng-change="vm.onDispositionChange('second')"
  99           >
 100             <md-option
 101               ng-value="disposition"
 102               ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
 103             >
 104               {{ disposition.name }}</md-option
 105             >
 106           </md-select>
 107         </md-input-container>
 108         <md-button
 109           ng-if="vm.secondLevelDisposition"
 110           ng-click="vm.clearDispositionSelection('second')"
 111           class="md-icon-button"
 112         >
 113           <md-icon
 114             md-font-icon="icon-cancel"
 115             aria-label="Clear second level disposition selection"
 116           >
 117           </md-icon>
 118         </md-button>
 119       </div>
 120       <div
 121         ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
 122         layout="row"
 123         layout-align="start center"
 124       >
 125         <md-input-container class="md-block" flex>
 126           <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
 127             >Third Level Disposition</label
 128           >
 129           <md-select
 130             name="thirdLevelDisposition"
 131             ng-model="vm.thirdLevelDisposition"
 132           >
 133             <md-option
 134               ng-value="disposition"
 135               ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
 136               ng-disabled="disposition.canSelect === false"
 137               >{{ disposition.name }}</md-option
 138             >
 139           </md-select>
 140         </md-input-container>
 141         <md-button
 142           ng-if="vm.thirdLevelDisposition"
 143           ng-click="vm.clearDispositionSelection('third')"
 144           class="md-icon-button"
 145         >
 146           <md-icon
 147             md-font-icon="icon-cancel"
 148             aria-label="Clear third level disposition selection"
 149           >
 150           </md-icon>
 151         </md-button>
 152       </div>
 153       <md-input-container class="md-block">
 154         <label translate="DASHBOARDS.NOTE">Note</label>
 155         <textarea
 156           ng-model="vm.interaction.note"
 157           md-maxlength="255"
 158           max-rows="5"
 159           autofocus
 160         ></textarea>
 161       </md-input-container>
 162       <div class="error-list">
 163         <div
 164           ng-repeat="error in vm.errors"
 165           class="error"
 166           layout="row"
 167           layout-align="space-between center"
 168         >
 169           <div>
 170             <span class="message">{{error.message}}</span>
 171             <span class="type">({{error.type}})</span>
 172           </div>
 173           <md-button class="md-icon-button">
 174             <md-icon
 175               md-font-icon="icon-alert-box"
 176               aria-label="alert error"
 177               class="s16"
 178             ></md-icon>
 179           </md-button>
 180         </div>
 181       </div>
 182     </md-dialog-content>
 183     <md-dialog-actions layout="row" layout-align="space-between center">
 184       <div layout="row" layout-align="start center">
 185         <md-button
 186           type="submit"
 187           ng-click="vm.saveDisposition()"
 188           class="send-button md-accent md-raised"
 189           ng-if="!vm.interaction.closed && (vm.firstLevelDisposition || vm.secondLevelDisposition || vm.thirdLevelDisposition)"
 190           aria-label="CLOSE_AND_DISPOSE"
 191           translate="DASHBOARDS.CLOSE_AND_DISPOSE"
 192           translate-attr-aria-label="DASHBOARDS.CLOSE_AND_DISPOSE"
 193         >
 194           CLOSE AND DISPOSE
 195         </md-button>
 196         <md-button
 197           type="submit"
 198           ng-click="vm.saveDisposition(false)"
 199           class="send-button md-accent md-raised"
 200           ng-if="!vm.interaction.closed && !vm.firstLevelDisposition"
 201           ng-disabled="vm.mandatoryDisposition"
 202           aria-label="CLOSE_WITHOUT_DISPOSE"
 203           translate="DASHBOARDS.CLOSE_WITHOUT_DISPOSE"
 204           translate-attr-aria-label="DASHBOARDS.CLOSE_WITHOUT_DISPOSE"
 205         >
 206           CLOSE WITHOUT DISPOSE
 207         </md-button>
 208         <md-button
 209           type="submit"
 210           ng-click="vm.saveDisposition()"
 211           class="send-button md-accent md-raised"
 212           ng-if="vm.interaction.closed"
 213           ng-disabled="vm.mandatoryDisposition && !vm.firstLevelDisposition"
 214           aria-label="DISPOSE"
 215           translate="DASHBOARDS.DISPOSE"
 216           translate-attr-aria-label="DASHBOARDS.DISPOSE"
 217         >
 218           DISPOSE
 219         </md-button>
 220         <div ng-if="vm.mandatoryDisposition">
 221           <md-icon
 222             md-font-icon="icon-information-outline"
 223             aria-label="Mandatory Disposition"
 224           ></md-icon>
 225           <span
 226             class="no-margin font-size-12 line-height-30"
 227             translate="DASHBOARDS.HELP.MANDATORY_DISPOSITION_ENABLED"
 228           ></span>
 229         </div>
 230       </div>
 231     </md-dialog-actions>
 232   </form>
 233 </md-dialog>